<template>
	<view class="box">

		<!-- 维修员“任务” -->
		<task class="taskStyle" @getTabIndex="getTabIndex" @acceptOrder="acceptOrder" @refuseOrder="refuseOrder"
			@viewOrderDetails="viewOrderDetails" :avatar="avatar" :nickName="nickName" :state="state"
			:orderListData="orderListData" :inProgressData="inProgressData" v-show="tabIndex == 0">
		</task>

		<!-- 维修员“我的” -->
		<view v-show="tabIndex == 1">
			<repair-mine></repair-mine>
		</view>


		<!-- 底部导航 -->
		<view class="bottomTabbar">
			<base-tab-list-tabbar class="tabbar" :otherStyle="customStyle" :tabIndex="tabIndex" :tabList="tabList"
				@changeTab="changeTab"></base-tab-list-tabbar>
		</view>


	</view>
</template>

<script>
	import MyStore from '@/store/index.js'
	import config from "@/config"; // 导入配置文件
	// 基本路径
	const baseURL = config.baseURL;

	import {
		taskAPI,
		myAPI
	} from '@/api/maintenanceWorkerApi.js'

	export default {
		data() {
			return {
				///////////////////////////////////  任务相关代码   //////////////////////////////////////////////
				customStyle: {
					justifyContent: "space-around", // 传递自定义的样式属性对象
					// 其他样式属性可以根据需要添加
				},
				tabList: [{
						label: "任务"
					},
					{
						label: "我的"
					}
				],

				tabIndex: 0,
				customStyle: {
					justifyContent: "space-around", // 传递自定义的样式属性对象
					// 其他样式属性可以根据需要添加
				},
				marginStyle: {
					marginTop: "150rpx" // 使用驼峰式命名，并去掉分号
				},
				clickLabel: '',
				orderListData: [], //可接单列表
				inProgressData: [], //进行中列表
				maintainerId: 0,
				avatar: "",
				state: "",
				nickName: "",

				///////////////////////////////////  “我的”相关代码   //////////////////////////////////////////////

			};
		},
		methods: {
			///////////////////////////////////  任务相关代码   //////////////////////////////////////////////
			getTabIndex(TabIndex) {
				console.log("maintenance-worker页面的getTabIndex===>", TabIndex);
				if (TabIndex == 0) {
					console.log("可接单列表  请求数据");
					this.getOrderList();
				} else if (TabIndex == 1) {
					console.log("进行中列表  请求数据");
					this.getInProgress();
				}
			},
			changeTab(index) {
				this.tabIndex = index; // 更新标签索引
				console.log("打印index", index);

				this.clickLabel = this.tabList[index].label;
				console.log(this.clickLabel);
			},
			getOrderList() {
				taskAPI.getOrderList(this.maintainerId)
					.then(orderListData => {
						this.orderListData = orderListData;
					})
					.catch(err => {
						console.error("获取可接单列表失败:", err);
					});
			},
			getInProgress() {
				taskAPI.getInProgress(this.maintainerId)
					.then(inProgressData => {
						this.inProgressData = inProgressData;
					})
					.catch(err => {
						console.error("获取进行中列表失败:", err);
					});
			},
			acceptOrder(orderId) {
				taskAPI.acceptOrder(orderId)
					.then(() => {
						this.getOrderList();
					})
					.catch(err => {
						console.error("接单失败:", err);
					});
			},
			refuseOrder(orderId) {
				taskAPI.refuseOrder(orderId)
					.then(() => {
						this.getOrderList();
					})
					.catch(err => {
						console.error("拒绝接单失败:", err);
					});
			},
			viewOrderDetails(orderId, taskState, machineModelNumber) {
				taskAPI.viewOrderDetails(orderId, taskState, machineModelNumber);
			},
			///////////////////////////////////  “我的”相关代码   //////////////////////////////////////////////

		},

		onLoad() {
			///////////////////////////////////  任务相关代码   //////////////////////////////////////////////
			const userData = uni.getStorageSync('userData');
			console.log("user登录记录", userData); // 输出: user登录记录

			if (userData == "") {
				// 不存在名为 'userData' 的数据 或者身份为普通用户
				uni.showToast({
					duration: 2000,
					title: "您还未登录，即将跳转登录！",
					icon: 'none',
					mask: "true"
				})

				setTimeout(function() {
					uni.redirectTo({
						url: '/pages/login/login'
					})
				}, 2000); // 1000毫秒等于1秒钟

				return;
			} else if (userData.role != 'employee') {
				uni.showToast({
					duration: 2000,
					title: "您不是维修员，无法访问！",
					icon: 'none',
					mask: "true"
				})

				setTimeout(function() {
					uni.redirectTo({
						url: '/pages/login/login'
					})
				}, 2000); // 1000毫秒等于1秒钟

				return;
			}

			this.avatar = userData.user.avatar;
			this.nickName = userData.user.username;
			console.log("打印维修员状态：", userData.user.stateEnum);

			switch (userData.user.stateEnum) {
				case "ON":
					this.state = "已上班";
					break;
				case "VACATION":
					this.state = "休假中";
					break;
				case "WORKING":
					this.state = "任务中";
					break;
				case "OFF":
					this.state = "已下班";
					break;
				default:
					this.state = "";
					break;
			}


			console.log("昵称：", this.nickName);
			console.log("头像地址：", this.avatar);
			console.log("状态：", this.state);

			this.maintainerId = userData.user.id; //拿到当前登录用户的ID
			this.getOrderList();





			///////////////////////////////////  “我的”相关代码   //////////////////////////////////////////////


		},
		onPullDownRefresh() {
			// this.getOrderList();
			// 可用来刷新“我的”页面的数据
			uni.stopPullDownRefresh();
		}

	}
</script>

<style lang="scss">
	.box {
		background-color: #333333;
		height: 95vh;
		width: 100vw;


		.bottomTabbar {
			height: 7vh;
			width: 100vw;
			z-index: 5;
			// background-color: #ffaaff;
			position: fixed;
			bottom: 0;
			left: 0;
		}
	}
</style>
